{% load static %}
<!DOCTYPE html>
<html>
<head>
	<title>WebMap</title>
	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>
	<script async defer src="https://buttons.github.io/buttons.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis-network.min.js"></script>
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis-network.min.css" />

	<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

	<script src="{% static "/async.js" %}"></script>
	<style>
		body {
			background-image:url({% static "/img/bg.png" %});
			background-repeat: no-repeat;
			background-attachment: fixed;
			background-size:100% 100%;
		}
		.wbtn-small {
			border-radius:4px;
			padding:6px;
			color:#fff;
			font-size:11px;
			font-weight:bold;
			text-shadow:0px 0px 4px #666;
			/* box-shadow:1px 1px 2px #444; */
		}
		.perco {
			border-radius: 2px;
			background-color:#090;
			font-size:10px;
			font-family:monospace;
			color:#eee;
			text-align:center;
		}
		.title-small {
			color:#333;
			text-transform: uppercase;
			font-weight:400;
		}
		.small {
			font-size:12px;
		}
		.tmlabel {
			font-family: monospace;
			font-size: 12px;
			background-color: #999;
			border-radius: 4px;
			padding: 2px;
			padding-left: 4px;
			padding-right: 4px;
			color: #fff;
		}
		.label {
			padding:6px;
			border-radius:4px;
			font-size:12px;
			color:#fff;
		}

		.rightlabel {
			border-radius:2px;
			font-size:10px;
			font-weight:bold;
			text-align:center;
			position:absolute;
			padding-left:8px;
			padding-right:8px;
			margin-left:10px;
			margin-top:-20px;
			color:#fff;
			text-transform:uppercase;
		}
		.leftlabel {
			border-radius:2px;
			font-size:10px;
			text-align:center;
			position:absolute;
			padding-left:8px;
			padding-right:8px;
			color:#fff;
			text-transform:uppercase;
			left:20px;
		}
		.hindex {
			border-radius:2px;
			font-size:10px;
			margin-top:-16px;
			margin-left:-30px;
			padding-left:8px;
			padding-right:8px;
			background-color:#eee;
			width:24px;
		}
		.wm_menu {
			width:44px;
			position:fixed;
			left:6px;
			top:80px;
			background-color:rgba(40,40,40,0.8);
			padding-left:10px;
			padding-right:10px;
			z-index:9999;
			border-radius: 4px;
			overflow-y:hidden;
			box-shadow:1px 1px 10px #010101;
		}

		.material-icons{
			display: inline-flex;
			vertical-align: top;
		}

		.wm_menu li {
			height:28px;
			margin-bottom:10px;
			line-height:24px;
			font-size:14px;
		}

		.wm_line { border-bottom:solid #666 1px; height:1px; line-height:10px; margin-bottom:-10px;padding:0px;}
		.wm_line div {
			margin-top:-12px;
			font-size:8px;
			color:#999;
			text-align:center;
			text-transform:uppercase;
		}

		.wm_menu i {
			color:#eee;
			width:20px;
			text-align:center;
			cursor: pointer;
		}

		.wm_menu li:hover > i { color:#ffcc00; }
		.wm_menu li:hover > a { color:#ffcc00; }

		.wm_menu a {
			color:#ccc;
			margin-left:10px;
			display:none;
		}

		.arrow-up {
			position:fixed;
			left:18px;
			top:80px;
			width: 0; 
			height: 0; 
			border-left: 10px solid transparent;
			border-right: 10px solid transparent;
			border-bottom: 10px solid rgba(40,40,40,0.8);
			margin-top:-10px;
			z-index:99999;
		}

		.wmcard {
			background-color:rgba(250,250,250,0.1);
			color:#eee;
		}


	</style>
</head>

<body>

<div class="navbar-fixed">
<nav class="" id="topnavbar" style="background-color:rgba(10,10,10,0.0);box-shadow:none;">
	<div class="nav-wrapper">
		{% if scanfile and address %}
		<div class="col s5 right hide-on-med-and-down" style="margin-right:20px;">
			<a href="/" class="breadcrumb">{{ scanfile }}</a> <a href="/report/{{ address }}/" class="breadcrumb">{{ address }}</a>
		</div>
		{% endif %}
		{% if scanfile and not address %}
		<div class="col s5 right hide-on-med-and-down" style="margin-right:20px;">
			<a href="/" class="breadcrumb">{{ scanfile }}</a> 
		</div>
		{% endif %}
		<div class="row">
			<div class="col s1 hide-on-large-only" style="max-width:60px;">
				<a href="#!" onclick="javascript:$('.sidenav').sidenav('open');"><i class="material-icons white-text">menu</i></a>
			</div>
			<div class="col s4">
				<a href="#" class="brand-logo"><img src="/static/logo.png" style="max-width:200px;margin-top:8px;"></a>
			</div>
		</div>

	</div>
</nav>
</div>


{% if auth %}
<div class="arrow-up hide-on-med-and-down"></div>
<div class="wm_menu grey-text hide-on-med-and-down show-on-large">
	<ul>
		<li><i class="material-icons">track_changes</i> <a href="/setscanfile/unset">Show all nmap scan</a></li>
		<li><i class="material-icons">settings_input_antenna</i> <a href="/">Show scan details</a></li>
		<li><i class="material-icons">add_box</i> <a href="#!" onclick="javascript:newscan();">New Nmap scan</a></li>
		{% if scanfile %}
			<li><i class="fas fa-file-pdf" style="margin-left:2px;font-size:20px;"></i> <a href="#!" onclick="javascript:genPDF('{{ scanmd5 }}');">PDF Report</a></li>
			<li><i class="fas fa-bug" style="margin-left:2px;font-size:20px;"></i> <a href="#!" onclick="javascript:checkCVE();">Check CVE</a></li>
			<li><i class="fas fa-project-diagram" style="margin-left:2px;font-size:18px;"></i> <a href="/report/view/network">Network View</a></li>
		{% endif %}
		<li id="activescan_line" style="display:none;" class="wm_line"><div>scan</div></li>
		<section id="activescan_info" style="display:none;">
			<li><i class="fas fa-info-circle"></i> <a href="#!" id="activescan_details">&nbsp;</a></li>
		</section>
		<li id="activescan_progress" style="display:none;"><div class="progress"><div class="indeterminate orange"></div></div></li>
		{% if address %}
		{% else %}
			<li class="wm_line"><div>more</div></li>
			{% for i,v in tr.items %}
				{% if v.filename %}
					<li><i class="material-icons">keyboard_arrow_right</i> <a href="{{ v.href }}">{{ v.filename|safe }}</a></li>
				{% else %}
					<li><i class="material-icons">keyboard_arrow_right</i> <a href="/report/{{ i }}">{{ i }}</a></li>
				{% endif %}
			{% endfor %}
		{% endif %}

		{% if cveids %}
			<li class="wm_line"><div>CVE</div></li>
			{% for i,v in cveids.items %}
				<li><i class="fas fa-exclamation-triangle"></i> <a onclick="javascript:$('html, body').animate({ scrollTop: ($('#{{ i }}').offset().top - 60) }, 1000);" href="#!">{{ i }}</a></li>
			{% endfor %}
		{% endif %}
		<li class="wm_line"><div>social</div></li>
		<li><i class="fab fa-github" style="font-size:20px;"></i> <a href="">GitHub Project</a></li>
		<li><i class="fas fa-star"></i> <a href="#!" id="githubstar">1</a></li>
		<li><i class="fas fa-code-branch"></i> <a href="#!" id="githubfork">1</a></li>
	</ul>
</div>
{% endif %}

{% if scanfile %}
<ul id="slide-out" class="sidenav">
	<li><div class="user-view">
		<div class="background" style="text-align:center;">
			<img src="/static/logoblack.png" style="max-width:200px;margin-top:20px;">
		</div><br>
	</div></li>
	<li><a href="/setscanfile/unset"><i class="material-icons">track_changes</i>Show all Nmap scan</a></li>
	<li><a href="/"><i class="material-icons">settings_input_antenna</i>Show scan details</a></li>

	<li><div class="divider"></div></li>
	<li><a class="subheader">Support WebMap on GitHub</a></li>
	<li style="padding-left:30px;margin-top:-20px;"><a class="github-button" href="https://github.com/LoiusCypher" data-size="large" data-show-count="true" aria-label="Follow @LoiusCypher on GitHub">Follow @LoiusCypher</a></li>
	<li style="padding-left:30px;margin-top:-20px;"><a class="github-button" href="https://github.com/LoiusCypher/WebMap" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star LoiusCypher/WebMap on GitHub">Star WebMap</a></li>
	<li style="padding-left:30px;margin-top:-20px;"><a class="github-button" href="https://github.com/LoiusCypher/WebMap/fork" data-icon="octicon-repo-forked" data-size="large" data-show-count="true" aria-label="Fork LoiusCypher/WebMap on GitHub">Fork WebMap</a></li>
</ul>
{% endif %}

	{% block content %}
	{% endblock %}

	<!-- MODAL -->
	<div id="modal1" class="modal modal-fixed-footer">
		<div class="modal-content">
			<h4 id="modaltitle">un titolo</h4>
			<p id="modalbody">del testo</p>
		</div>
		<div class="modal-footer" id="modalfooter">
			<a href="#!" class="modal-close waves-effect waves-green btn grey white-text">OK</a>
		</div>
		{% csrf_token %}
	</div>

	{{ cpestring|safe }}

	<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
	<script>

		$(document).ready(function(){
			$('.sidenav').sidenav();
			$('.modal').modal();
			$('.tabs').tabs();
		});

	</script>
</body>
</html>
